<!DOCTYPE html>
<html lang="zh">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>stm32示例</title>


	<script>
        function onled() {
            // function sendtem() {
            // console.log("test");
            // var v1 = document.getElementById("d1").value;
            // var v2 = document.getElementById("d2").value;
            var req = "1";
            // console.log(req);
            var xhr = new XMLHttpRequest();
            var url = "";
            xhr.open("post", url, true);
            xhr.send(req);

            // xhr.onload = function () {
            //     // var response = xhr.responseText;
            //     // console.log(response);
            //     // document.getElementById("d1").value = response;
            //     var response = xhr.responseText;
            //     console.log(response);
            //     document.getElementById("d2").value = response;   
            // }
        // }

        }
    </script>
    <script>
        function offled() {

            var req = "2";
            // console.log(req);
            var xhr = new XMLHttpRequest();
            var url = "";
            xhr.open("post", url, true);
            xhr.send(req);



        }
    </script>
    <script>
        function onbeep() {

            var req = "3";
            // console.log(req);
            var xhr = new XMLHttpRequest();
            var url = "";
            xhr.open("post", url, true);
            xhr.send(req);



        }
    </script>
    <script>
        function offbeep() {


            var req = "4";
            // console.log(req);
            var xhr = new XMLHttpRequest();
            var url = "";
            xhr.open("post", url, true);
            xhr.send(req);


        }
    </script>
 <script>
    function onfan() {
        // function sendtem() {
        // console.log("test");
        // var v1 = document.getElementById("d1").value;
        // var v2 = document.getElementById("d2").value;
        var req = "5";
        // console.log(req);
        var xhr = new XMLHttpRequest();
        var url = "";
        xhr.open("post", url, true);
        xhr.send(req);

        // xhr.onload = function () {
        //     // var response = xhr.responseText;
        //     // console.log(response);
        //     // document.getElementById("d1").value = response;
        //     var response = xhr.responseText;
        //     console.log(response);
        //     document.getElementById("d2").value = response;   
        // }
    // }

    }
</script>
<script>
    function offfan() {

        var req = "6";
        // console.log(req);
        var xhr = new XMLHttpRequest();
        var url = "";
        xhr.open("post", url, true);
        xhr.send(req);



    }
</script>






















	
	<script type="text/javascript">
		function init() {
			refresh();
		}

		function refresh() {
			var xhr = new XMLHttpRequest(); // 创建XMLHttpRequest对象
			var url = ""; // 请求的URL

			xhr.open("POST", url, true); // 配置请求：POST方法、URL、异步请求

			var post_req = {
				"type": 1,
				"limit": "all"
			};

			xhr.onreadystatechange = function () {
				if (xhr.readyState === 4 && xhr.status === 200) { // 请求完成且成功
					var response = xhr.responseText; // 获取响应数据
					var info = JSON.parse(response)  //将json字符串反序列化为json对象
					console.log(info); // 在浏览器控制台打印响应数据
					for (var i = 0; i < info.data.length; i++) {
						// console.log('data = ', info.data[i].val)

						if (info.data[i].key == 1) {
							document.getElementById('temp').value = info.data[i].val;
						} else if (info.data[i].key == 2) {
							document.getElementById('hum').value = info.data[i].val;
						} else if (info.data[i].key == 3) {
							document.getElementById('ill').value = info.data[i].val;
						}
					}
				}
			};

			//将json对象序列化为json字符串
			xhr.send(JSON.stringify(post_req)); // 发送请求，并将数据转换为JSON字符串
		}

	</script>
</head>

<body onload="init()">
	<a href="index.html">主页</a>
	<a href="stm32.html">stm32示例页面</a>
	<a href="modbus.html">modbus示例页面</a>

	<div>
		<form>
			<br />
			<label for="temp">温度</label>
			<input type="text" id="temp" value="" />
			<br />
			<label for="hum">湿度</label>
			<input type="text" id="hum" value="" />
			<br />
			<!-- 注释部分可按需处理，这里暂不显示相关输入框 -->
			<!-- <label for="ill">光照</label>
    <input type="text" id="ill" value="" />
    <br />
    <label for="a">二氧化碳浓度</label>
    <input type="text" id="a" value="" /> -->
			<br />
			<label for="led">灯</label>
			<input type="radio" name="led" id="a" onclick="onled()" />开
			<input type="radio" name="led" id="b" checked="checked" onclick="offled()" />关
			<br />
			<label for="beep">烟雾报警</label>
			<input type="radio" name="beep" id="c" onclick="onbeep()" />开
			<input type="radio" name="beep" id="d" checked="checked" onclick="offbeep()" />关
			<br />
			<label for="fan">空调</label>
			<input type="radio" name="fan" id="e" onclick="onfan()" />开
			<input type="radio" name="fan" id="f" checked="checked" onclick="offfan()" />关
		</form>
	</div>
</body>

</html>